
<style>
.error{/*0审核失败*/
    color:#ed3f14;
}
.NotFillIn{/*1未填写*/
    color:#ff9900;
}
.FillIn{/*2已填写*/
    color:#993300;
}
.AlreadyReport{/*3已上报*/
    color:#2d8cf0;
}
.success{/*4审核通过*/
    color:#19be6b;
}
.lock{/*5锁定*/
    color:#80848f;
}
</style>
<template>
<div style="padding:10px;">
    <Row class="row">
        <Col>
            <Card class="card" dis-hover>
                <p slot="title" style="height:40px;">
                    <Icon type="android-contact" size=40  color="#239DCE"></Icon>&nbsp;&nbsp;&nbsp;&nbsp;
                    <label style="font-size:30px">欢迎您:{{UserModel.UserName}}</label>
                </p>  
                <table class="userinfo" style="font-size:16px">
                    <tr><th>上次登录:</th><td><span>{{UserModel.LastLoginTime|moment}}</span></td><th>所在地区:</th><td><span>{{UserModel.AreaCode|omgAreaName}}</span></td></tr>
                    <tr><th>个人电话:</th><td><span>{{UserModel.Phone}}</span></td><th>工作电话:</th><td><span>{{UserModel.TelPhone}}</span></td></tr>
                    <tr><th>电子邮件:</th><td><span>{{UserModel.Email}}</span></td><th>现任职务:</th><td><span>{{UserModel.PostName}}</span></td></tr>
                    <tr><th>工作单位:</th><td><span>{{UserModel.UnitName}}</span></td><th>单位地址:</th><td><span>{{UserModel.UnitAddress}}</span></td></tr>
                    <tr><th>特别提醒:</th><td colspan="3"><span style="color:red;">***以上资料不正确，请点击右上角进行修改***</span></td></tr>
                </table>
                    <!--<ul style="height:417px;">
                        <li style="padding: 10px;"><span>上次登录:</span><span>{{UserModel.LastLoginTime|moment}}</span></li>
                        <li style="padding: 10px;"><span>所在地区:</span><span>{{UserModel.AreaCode|omgAreaName}}</span></li>
                        <li style="padding: 10px;"><span>个人电话:</span><span>{{UserModel.Phone}}</span></li>
                        <li style="padding: 10px;"><span>工作电话:</span><span>{{UserModel.TelPhone}}</span></li>
                        <li style="padding: 10px;"><span>电子邮件:</span><span>{{UserModel.Email}}</span></li>
                        <li style="padding: 10px;"><span>现任职务:</span><span>{{UserModel.PostName}}</span></li>
                        <li style="padding: 10px;"><span>工作单位:</span><span>{{UserModel.UnitName}}</span></li>
                        <li style="padding: 10px;"><span>单位地址:</span><span>{{UserModel.UnitAddress}}</span></li>
                        <li style="padding: 10px;"><span>特别提醒:</span><span><span style="color:red;">***以上资料不正确，请点击右上角进行修改***</span></span></li>                  
                    </ul>-->
            </Card>
        </Col>
    </Row>
    <Row  style="margin-top:10px;margin-bottom:10px">
        <Col style="padding-bottom: 100px">
            <Card class="card"  >
                <p slot="title" style="height:40px;">
                    <Icon type="clipboard" size=40 color="#239DCE"></Icon>&nbsp;&nbsp;&nbsp;&nbsp;
                    <label style="font-size:30px">进度概览</label> 
                    <span style="float:right;font-size:16px">
                        填报年度：
                        <Select v-model="FillInYear" placeholder="全部" style="width: 100px;font-size:16px" @on-change="initReportReview()">
                            <Option value="">全部</Option>
                            <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictText">{{item.DictText}}</Option>
                        </Select> 
                    </span>
                </p>
                <div class="CardContent">
                    <Table :context="self" ref="table" :stripe=true :border=true :columns="TableHeader" :data="datas.model" size="large" height=417>
                    </Table>
                </div>          
            </Card>
        </Col>
    </Row>
</div>
</template>
<script>
 export default {
    data() {
        return {
            self:this,
            userInfo: this.GetlocaStorage("CSuserinfo"),
            CurrentYear: this.GetCurrentYear(),//当前年度
            CreateYearList: this.GetGroupDict("ReportYear"), //上报年份
            FillInYear:'',
            UserModel: {},
            clientHeight: window.innerHeight - 137,//表格默认高度
            datas:[],
            TableHeader: [{
                    title: '报表名称',
                    key: 'ReportName',
                    width:395,
                    //fixed: 'left'
                },
                {
                    title: '审核失败',
                    key: 'ReviewFalse',
                    className:'error'
                },
                {
                    title: '未填写',
                    key: 'NotFillIn',
                    className:'NotFillIn'
                },
                {
                    title: '未上报',
                    key: 'FillIn',
                    className:'FillIn'
                },
                {
                    title: '已上报',
                    key: 'AlredayReport',
                    className:'AlreadyReport'
                },
                {
                    title: '审核通过',
                    key: 'ReviewSuccess',
                    className:'success'
                }, 
                {
                    title: '锁定',
                    key: 'Lock',
                    className:'lock'
                }
            ],
        }
    },
    mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
            return (() => {
                that.clientHeight = window.innerHeight + 200;
            })()
        };
    },
    methods: {
        initUser() {
            var self = this;
            this.$http.get("User", { params: { id: this.userInfo.UserId } }).then(
                function (res) {
                    if (res.data.status == 1) {
                        self.UserModel = res.data.model;
                    }
                    else {
                        self.$Modal.error({ title: "提示信息", content: "系统异常，请与管理员联系!!!" });
                    }
                });
        },
        initReportReview(){
            var self = this;
            if (self.FillInYear != null && self.FillInYear != '') {
                self.FillInYear = self.FillInYear;//获取当前系统年份
            } else {
                self.FillInYear = self.CurrentYear + '年'; //获取填报年度-----数据字典值
            }
            self.$http.get('Report/GetReportReview',{params:{AreaCode:self.userInfo.AreaCode,FillInYear:self.FillInYear,Account:self.userInfo.Account}}).then(function(res) {
                if (res.data.status === 1) {
                    self.datas = res.data;
                } 
                else {
                    self.$Modal.error({
                        title: '提示信息',
                        content: res.data.message
                    });
                }
            });
        }
    },
    //创建Vue页面方法
    created: function () {
        this.initUser();
        this.initReportReview();
    }, 
}
</script>